<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="common/common_head :: commonHeader('厚声供应商关系管理系统')"/>
</head>
<body class="gray-bg">

<div class="middle-box text-center loginscreen  animated fadeInDown" style="padding-top: 12%">
    <div>
        <div style="margin-left: -70px; margin-right: -70px; padding-bottom: 15px;">

            <!-- <h1 class="logo-name" style="font-size: 100px; letter-spacing: 5px;"></h1> -->
            <h1 class="logo-name" style="font-size: 80px; letter-spacing: 5px;">
                UR-SRM
            </h1>

        </div>
        <h3>欢迎使用 </h3>

        <form class="m-t" role="form" method="post" id="loginForm" th:action="@{/sys/login}">
            <div class="form-group">
                <input id="username" type="text" class="form-control" placeholder="用户名" required=""/>
            </div>
            <div class="form-group">
                <input id="password" type="password" class="form-control" placeholder="密码" required=""/>
            </div>
            <input type="hidden" th:value="${hasCaptcha}" id="hasCaptcha"/>
            <div th:if="${hasCaptcha == 'true'}">
                <div class="form-group has-feedback">
                    <input id="captcha" type="text" class="form-control" name="captcha" placeholder="验证码" required=""/>
                    <span class="glyphicon glyphicon-warning-sign form-control-feedback"></span>
                </div>
                <div class="form-group has-feedback">
                    <img alt="如果看不清楚，请单击图片刷新！" class="pointer" th:src="@{/getCaptcha}" id="captchaImg"
                         onclick="refreshCode()"><a href="javascript:refreshCode();" style="margin-left: 10px;">点击刷新</a>
                </div>
            </div>

            <div class="form-group" style="float: left;">
                <div class="checkbox" style="text-align: left">
                    <label>
                        <input id="remember" type="checkbox" name="remember" style="margin-top: 2px;">记住我
                    </label>
                </div>
            </div>

            <button type="button" onclick="login()" class="btn btn-primary block full-width m-b">登 录</button>
        </form>
    </div>
</div>

<!--引入公共js-->
<div th:include="common/onload_js :: onloadJS"></div>
</body>
<script type="text/javascript">
    //判断是否是iframe刷新
    window.onload = function () {
        if (window.parent.window != window) {
            window.top.location = ctxPath + "/login";
        }
    }

    $(function () {//回车触发登录
        $(document).keyup(function (event) {
            if (event.keyCode == 13) {
                login();
            }
        });
    });

    function refreshCode() {
        $("#captchaImg").attr('src', ctxPath + '/getCaptcha?t=' + $.now());
    }

    function login() {
        var username = $("#username").val();
        if (username == '') {
            Dialog.tips("用户名不能为空", "username");
            return
        }
        var password = $("#password").val();
        if (password == '') {
            Dialog.tips("密码不能为空", "password");
            return
        }
        var data = {
            username: username,
            password: password,
            remember: $("#remember").is(":checked")
        }

        var hasCaptcha = $("#hasCaptcha").val();
        if (hasCaptcha == 'true') {
            var captcha = $("#captcha").val();
            if (captcha == '') {
                Dialog.tips("验证码不能为空", "captcha");
                return
            }
            data["captcha"] = captcha
        }
        Page.ajaxPOST(ctxPath + "/sys/login", data, function () {
            window.location.href = ctxPath + "/sys/index";
        }, {loadingMsg: "正在验证用户……"});
    }
</script>

</html>
